<template>
  <div class="home-container">
    <el-container>
      <el-header>
        <el-button type="primary" @click="bigFileUpload">大文件分片上传</el-button>
        <el-button type="primary" @click="bigFileNewUpload">大文件上传（断点续传）</el-button>
        <el-button type="primary" @click="bigFileUploadMock">大文件上传Mock（模拟断点）</el-button>
        <el-button type="primary" @click="streamOutput">AI流式输出（SSE）</el-button>
        <el-button type="primary" @click="aiChatStream">AI聊天流式输出（SSE）</el-button>
      </el-header>
      <el-main>
        <router-view />
      </el-main>
    </el-container>
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router';
const router = useRouter();

const bigFileUpload = () => {
  router.push('/bigFileUpload')
}

const bigFileUploadMock = () => {
  router.push('/bigFileUploadMock')
}

const bigFileNewUpload = () => {
  router.push('/bigFileNewUpload')
}

const streamOutput = () => {
  router.push('/streamOutput')
}

const aiChatStream = () => {
  router.push('/aiChatStream')
}
</script>

<style scoped lang="scss">
.home-container {
  width: 100%;
  height: 100%;
  padding: 8px;

  .el-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-color: #c3d3eb;
  }
}
</style>